<template>
  <div class="store-container">
    <Headbar/>
    <Hungbar/>
    <HeadMenu :info="info"/>
    <NavList v-if="info && goodsClassify" index="xorder" :factoryId="info.id" :classify="goodsClassify"/>
    <div class="store-content yh-layout-box xorder-content min-height-300">
      <div class="xorder-wrap mt-20" v-loading="loading" v-if="list && list.length != 0">
        <div class="xorder-ul">
          <router-link :to="{ name: 'SearchXorderDetail', params: {id: item.id} }" class="xorder-list fl mb-20" v-for="(item, idx) in list" :key="idx">
            <div class="xorder-header">
              <span class="xorder-user-img fl"><img :src="URL.PIC+item.factoryLogo"></span>
              <span class="xorder-company fl">{{ item.factoryName }}</span>
              <span class="xorder-label fl"><img src="@/assets/images/search/search_16.png"></span>
              <!-- <span class="xorder-label fl"><img src="../../assets/images/search/search_17.png"></span>
              <span class="xorder-label fl"><img src="../../assets/images/search/search_18.png"></span> -->
              <span class="ml-10" v-if="item.factoryIsCertified == 1">此信息已认证</span>
              <span class="ml-10" v-else>此信息未认证</span>
            </div>
            <div class="xorder-center">
              <div class="xorder-left fl">
                <img src="@/assets/images/search/search_23.png">
              </div>
              <div class="xorder-right fl">
                <p class="xorder-textName">{{ item.templateName }}</p>
                <div class="xorder-msg">
                  <span class="xorder-totalMoney">订单总金额：￥{{ item.amount }}</span>
                  <span class="xorder-time">备货时间：{{ item.stockupTime }}天</span>
                </div>
              </div>
            </div>
            <div class="xorder-footer-item">
              <p class="xorder-footer-content">
                <span class="footer-msg-left">
                  <img src="@/assets/images/search/search_24.png"/>
                  <span class="footer-address">{{ item.factoryAddr }}</span>
                </span>
                <span class="footer-msg-right fr">
                  <!-- {{ fmtDate(item.createTime, 'ymd') }} 发布 -->
                </span>
              </p>
            </div>
          </router-link>
        </div>
      </div>
      <null v-if="list && list.length == 0" tips="暂无协议订单哦~" />


      <Pagination v-show="total>0" :total="total" :page.sync="listQuery.page" :limit.sync="listQuery.size"
                  @pagination="getList"/>
    </div>
    <Footbars/>
  </div>
</template>

<script>
  import Headbar from '@/components/Layouts/Headbar'
  import Hungbar from '@/components/Layouts/Hungbar'
  import Footbars from '@/components/Layouts/Footbars'
  import HeadMenu from '../components/HeadMenu'
  import NavList from '../components/NavList'
  import {getFactoryInfo, getFactoryClassify} from '@/api/factory';
  import Pagination from '@/components/Pagination'
  import { getOpenList } from '@/api/xorder'
  import Null from '@/components/Null'
  export default {
    name: 'FactoryXorder',
    components: {
      Headbar,
      Hungbar,
      Footbars,
      HeadMenu,
      NavList,
      Pagination,
      Null,
    },
    data() {
      return {
        total: 0,
        list: null,
        listQuery: {
          page: 1,
          size: 20,
          templateName: null,
          factoryId: this.$route.params.factoryId,
          stockupTime: null,
        },
        loading: false,
        info: null,
        goodsClassify: null,
      }
    },
    async asyncData ({ app, query }) {
      let [res1, res2, res3] = await Promise.all([
         app.$axios.get('/factory/frontend/factory/select_one?id='+app.context.params.factoryId),
         app.$axios.get('/product/front/classify/custom_list?factoryId='+app.context.params.factoryId),
         // app.$axios.post('/product/front/product_list', {
         //   factoryId: app.context.params.factoryId,
         //   size: 20,
         //   page: 1
         // }),
       ])
       return {
         info: res1.data.data,
         goodsClassify: res2.data.data,
         // list: res3.data.data.list,
         // total: res3.data.data.total
       }
    },
    created() {
      // this.getFactoryInfo();
      // this.getFactoryClassify();
      this.getList();
    },
    methods: {
      // 获取云工厂信息
      // getFactoryInfo() {
      //   getFactoryInfo({id: null}).then(res => {
      //     this.info = res.data;
      //   })
      // },
      // // 获取云工厂类目
      // getFactoryClassify() {
      //   getFactoryClassify({factoryId: null}).then(res => {
      //     this.goodsClassify = res.data;
      //   })
      // },
      getList() {
        this.loading = true;
        getOpenList(this.listQuery).then(res=>{
          setTimeout(()=>{
            this.loading = false
            this.list = res.data.list
            this.total = res.data.total
          }, 300)
        })
      },
    }
  }
</script>

<style lang="scss" scoped>
  @import '@/styles/pages/xorderSearch.scss';
</style>
<style lang="scss">
.store-container .pagination-container{
  background: none
}
.store-container .null-container .null-content{
  padding-top: 60px;
  padding-bottom: 40px;
}

</style>
